#@layout("商品分类")
#define main()
<style>
    .upload-icon{
        padding: 18px;
        width: 54px;
        height: 54px;
        position: relative;
        border: 1px dashed #e2e2e2;
        text-align: center;
        float: left;
        cursor:pointer;
    }
    .upload-icon i{
        font-size: 40px;
        color: #009688;
    }
    .upload-icon span {
        font-size: 10px;
    }
    .layui-upload-img {
        width: 92px;
        height: 92px;
    }
    .image-div {
        position: relative;
        width: 92px;
        height: 92px;
        float: left;
        margin-right: 7px;
    }
    .image-div i{
        position: absolute;
        margin: -10px 0px 0px 80px;
        font-size: 18px;
        color: #5CACEE;
        cursor:pointer;
    }
    .image-div-default {
        position: absolute;
        bottom: 0;
        background-color: #5CACEE;
        color: #fff;
        font-size: 10px;
        padding: 1px;
        text-align: center;
    }
</style>
<body>
<div class="layui-form timo-compile">
    <form action="#(ctxAd)/goods/save">
        <input type="hidden" name="goods.id"  value="#(goods.id ??)"/>
        <div class="layui-form-item">
            <label class="layui-form-label">商品分类</label>
            <div class="layui-input-inline">
                <select name="goods.categoryId">
               		#for(cat : categoryList)
                 	<option value="#(cat.id)" #if(goods!=null && cat.id==goods.categoryId) selected="selected" #end >#(cat.categoryName)</option>
                 	#end
               </select>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">商品名称</label>
            <div class="layui-input-inline">
                <input class="layui-input" type="text" name="goods.goodsName"  placeholder="请输入商品名称" value="#(goods.goodsName ??)">
            </div>
        </div>
        <div class="layui-form-item layui-form-text">
            <label class="layui-form-label">商品图片</label>
            <div class="layui-upload-list">
            	<input type="hidden" name="goods.goodsImage" id="goodsImage" value="#(goods.goodsImage ??)" />
                <div id="upload-img-goodsImage">
                	#if(goods.goodsImage ??)
                	<div id="upload-show-goodsImage" ><div class="image-div"><i onclick="delImg('goodsImage')" class="layui-icon">&#x1007;</i><img src="#image(goods.goodsImage)" alt="" class="layui-upload-img"></div></div>
                	#end
                </div>
                <div class="upload-icon" id="upload-goodsImage" #if(goods.goodsImage ??) style="display: none" #end >
                    <i class="layui-icon">&#xe681;</i>
                    <span>点击上传</span>
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">规格描述</label>
            <div class="layui-input-inline">
                <input class="layui-input" type="text" name="goods.recommend"  placeholder="请输入规格描述(例: 64g金色)" value="#(goods.recommend ??)">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">成本价</label>
            <div class="layui-input-inline">
                <input class="layui-input" type="text" name="goods.costPrice"  placeholder="请输入成本价" value="#(goods.costPrice ??)">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">市场价</label>
            <div class="layui-input-inline">
                <input class="layui-input" type="text" name="goods.mktPrice"  placeholder="请输入商品市场价" value="#(goods.mktPrice ??)">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">消耗积分</label>
            <div class="layui-input-inline">
                <input class="layui-input" type="text" name="goods.scorePrice"  placeholder="请输入一次闯关消耗积分" value="#(goods.scorePrice ??)">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">闯关规则</label>
            <div class="layui-input-inline">
                <select name="goods.goodsRuleId">
               		#for(rule : goodsRuleList)
                 	<option value="#(rule.id)" #if(goods!=null && rule.id==goods.goodsRuleId) selected="selected" #end >#(rule.ruleName)</option>
                 	#end
               </select>
            </div>
        </div>
        <div class="layui-form-item layui-form-text">
            <label class="layui-form-label">状态</label>
            <div class="layui-input-block">
                <input type="radio" name="goods.status" value="1" title="开启" #if(goods != null && goods.status==1) checked #end>
                <input type="radio" name="goods.status" value="0" title="禁用" #if(!goods??) checked #end #if(goods != null && goods.status==0) checked #end>
            </div>
        </div>
        <div class="layui-form-item timo-finally">
            <button class="layui-btn ajax-submit" lay-submit lay-filter="ajax-submit"><i class="fa fa-check-circle"></i> 保存</button>
            <button class="layui-btn btn-secondary close-popup"><i class="fa fa-times-circle"></i> 关闭</button>
        </div>
    </form>
</div>
</body>
#end
#define js()
<script type="text/javascript" src="#(ctxAdSt)/wangEditor/wangEditor.min.js"></script>
<script>
	var $;
    layui.use(['upload', 'layer'], function() {
        $ = layui.jquery;
        var upload = layui.upload;
      	//图片上传
        upload.render({
            elem: '#upload-goodsImage',
            url: '#(ctxAd)/config/upload',
            multiple: true,
            number: 1,
            before: function(obj){
                obj.preview(function(index, file, result){
                    $('#upload-img-goodsImage').append('<div id="upload-show-goodsImage"><div class="image-div"><i class="layui-icon" onclick="delImg(\'goodsImage\')" >&#x1007;</i><img src="'+ result +'" alt="'+ file.name +'" class="layui-upload-img"></div></div>')
                    $('#upload-goodsImage').hide();
                });
            },
            done: function(res){
                $('#goodsImage').val(res.data[0]);
            }
        });

    });
    
    function delImg(id){
    	$('#upload-show-'+id).remove();
    	$('#upload-'+id).show();
    }
</script>
#end